Ext.define('HRMS.view.main.TabContainer', {
    extend: 'Ext.tab.Panel',
    alias: 'widget.tabcontainer',
	
    
	requires: [	
        //'HRMS.view.main.TabContainerPanel', // FIXME, it should be grouped within dasboard, 
		//'HRMS.view.dashboard.usermanagement.UserManagementPortlet',
		//FIXME it must be dynamically loaded
		'HRMS.view.user.AccountList'
	],
	
    activeTab: 0,
	
    initComponent: function() {
        var me = this;
	
		/*var colWest = {
			id: 'col-1',
			items: [
				{
					id     : 'portlet_administration',
					title  : 'Administration',
					items  : Ext.create('HRMS.view.dashboard.usermanagement.UserManagementPortlet'),
					tools: this.getTools(),
					width  : 350,
					height : 210
				}
			]
		};*/
		
        Ext.applyIf(me, {
            items: [
                /*{
                    xtype: 'panel',
                    title: 'Dashboard',
					padding: '5 5 5 5', // pad the layout from the window edges
					items : [
						{
							id: 'app-portal',
							xtype: 'portalpanel',
							region: 'center',
							items : [
								colWest
							]
						}						
					]
                },*/
                {
                	xtype: 'accountlist',
                	title: 'Removable Tab',
                	
                	/*items:[
                	     {xtype: 'accountlist'}
                	]*/
                		
                }
            ]
        });

        me.callParent(arguments);
    },

    //
	// FIXME This function should be in controller class
    // Get Top Right Window Tools
	//
	getTools: function() {
        return [{
            xtype: 'tool',
            type: 'gear',
            handler: function(e, target, header, tool){
                var portlet = header.ownerCt;
                portlet.setLoading('Loading...');
                Ext.defer(function() {
                    portlet.setLoading(false);
                }, 2000);
            }
        }];
    },
});